<template>
	<div class="index">
	  <div class="center">
		<left></left>
		<div class="right">
		  <top></top>
		  <div class="hei10"></div>
		  <!-- <div class="team">
			<div class="powertop">
			  <div class="powertopcon">
				<div  class="powertopli"  >店铺信息</div>
			  </div>
			</div>
		  </div> -->
		  <div class="con">
			<el-page-header style="margin-bottom: 20px;" @back="goBack" content="接口订单查询任务"></el-page-header>
			<!-- <div class="t_search_box">
			  <el-button style="background-color: #2974FF;"  type="danger" round @click="openadd"  >添加商品</el-button>
			</div> -->
			<div>
			  <el-table
			  :header-cell-style="{ 
			  background:'#F4F4F4',
			  color:'#7D8087'}"
				:data="tableData"
				style="width: 100%;margin-top: 20px;">
				<el-table-column
				  prop="channel_name"
				  align="center"
				  label="接口渠道">
				</el-table-column>
				<el-table-column
				  prop="start_at"
				  align="center"
				  label="查询起始时间">
				</el-table-column>
				<el-table-column
				  prop="end_at"
				  align="center"
				  label="查询结束时间">
				</el-table-column>
				<el-table-column
				  prop="state_name"
				  align="center"
				  label="查询状态">
				</el-table-column>
				<el-table-column
				  prop="find_num"
				  align="center"
				  label="查询目标单量">
				</el-table-column>
				<el-table-column
				  prop="already_num"
				  align="center"
				  label="已查询单量">
				</el-table-column>
				<el-table-column
				  prop="created_at"
				  align="center"
				  label="添加时间">
				</el-table-column>
				<el-table-column label="操作" align="center">
				  <template slot-scope="scope">
					<el-button
						v-if="scope.row.excel_path"
					  size="mini"
					  type="text"
					  @click="daochu(scope.row.excel_path)">下载查询结果</el-button>
					<el-button
					  size="mini"
					  type="text"
					  @click="opendel(scope.row.id)">删除查询任务</el-button>
				  </template>
				</el-table-column>
			  </el-table>
			  <!-- <div style="text-align: right;margin-top: 20px;">
				<el-pagination
				  @current-change="changepage"
				  background
				  layout="prev, pager, next"
				  :total="total">
				</el-pagination>
			  </div> -->
			  <div style="text-align: right;margin-top: 20px;">
					<el-pagination
						background
						:page-size="search.pageSize"
						@current-change="pagechange"
						layout="total,prev, pager, next"
						:total="total">
					</el-pagination>
				</div>
			</div>
		  </div>
		</div>
	  </div>
	  <!-- 添加商品 -->
	  <el-dialog
		title="删除查询任务"
		:center="true"
		:close-on-click-modal="false"
		:visible.sync="deldialog"
		center="true"
		width="500px">
		<div class="t_search_box" style="text-align: center;color: #2974FF;text-align: center;">
			删除后已查询的结果将会保存在订单上，未查询的将不会再查询
		</div>
		<span slot="footer" class="dialog-footer">
		  <el-button style="background-color: #2974FF;" type="danger" round @click="handleDelete">确 定</el-button>
		</span>
	  </el-dialog>
	   
	</div>
  </template>
  
  <script>
	import axios from "axios";
	import top from '@/components/top.vue'
	import left from '@/components/left.vue'
	import foot from '@/components/foot.vue'
	import robot from '@/components/robot.vue'
	export default {
	  components: {
		"left": left,
		"top": top,
		'foot': foot,
		"robot":robot
	  },
	  name: 'apicheckorder',
	  data() {
		return {
		  
		  shopid:'',
		  search:{
			"page": 1,
    		"pageSize":20
		  },
		  tableData: [],
			deldialog:false,
			
			total:0,
			delid:''
		}
	  },
	  created() {
		//店铺权限问题
			  this.shopid = JSON.parse(localStorage.getItem('SHOP')).shop_id;
		//列表
		this.getlist()
	   
	  },
	  methods: {
			//分页
			pagechange(val){
				this.search.page = val
				//列表
				this.getlist()
			},
		  //列表
		  getlist(){
			axios.get('/api/plan-market/upstream/channel/online/get',{
				params:this.search
			})
			.then((response) => {
			  if (response.data.msg.code == 0) {
				console.log('列表')
				console.log(response)
				this.tableData = response.data.data.data
				this.total = response.data.data.total
			  } else {
				this.$message.error(response.data.msg.info);
			  }
			})
		  },
		  //翻页
		  changepage(val){
			console.log(val)
			this.search.page = val
			this.getlist()
		  },
		 
		 
		  //返回
		  goBack() {
			this.$router.push('/productionBasismanag/productionBasismanagDj')
		  },
		  //打开删除
		  opendel(id){
			this.delid = id
			this.deldialog = true
		  },
		  //删除
		  handleDelete(){
			axios.post('/api/plan-market/upstream/channel/online/del',{
				id:this.delid
			  })
			  .then((response) => {
				if (response.data.msg.code == 0) {
				  this.$message({
					message: '操作成功',
					type: 'success'
				  });
				  this.getlist()
				  this.deldialog = false
				} else {
				  this.$message.error(response.data.msg.info);
				}
			  })
		  },
		  daochu:function(excel_path){
				
			window.location.href = excel_path
			// axios.post('/api/plan-market/goods/gift/record/export',{
			// 	is_all:type
			// })
			// .then((response) => {
			// 	if (response.data.msg.code == 0) {
			// 		console.log(response.data.data)
					
			// 		window.location.href = response.data.data

			// 		// console.log('http://118.190.155.55'+response.data.data)

			// 	} else {
			// 		this.$message.error(response.data.msg.info);
			// 	}
			// })
			},
	  },
	  beforeDestroy(){
	   
	  },
	  
	  
	}
  </script>
  
  <style  scoped>
  
  
  
	  .team {
		background: #F9F9F9;
	  }
  
	  .powertop {
		display: flex;
		justify-content: space-between;
		align-items: center;
	  }
	  .powertopcon {
		display: flex;
		width: 800px;
	  }
	  .t_jqr_box{
		background-color: #007EFF;
		color: white;
		font-size: 14px;
		display: flex;
		align-items: center;
		justify-content: center;
		height: 32px;
		width: 160px;
		margin-right: 30px;
		border-radius: 3px;
		cursor: pointer;
  
	  }
	  .powertopli {
		width: 180px;
		line-height: 50px;
		border-bottom: 3px #F9F9F9 solid;
		color: #727272;
		border-right: 1px #F9F9F9 solid;
		font-size: 16px;
		text-align: center;
		cursor: pointer;
	  }
  
	  .powertopact {
		background: #FFFFFF;
		border-bottom: 3px #2974FF solid;
		color:#2974FF ;
	  }
  
	  .piliang {}
  
	  .piliangxuan {
		padding: 3px 0;
	  }
  
	  .mesquanxuan {
		padding: 10px 30px 20px 0px;
		display: flex;
		font-size: 14px;
		background: #f4f4f4
	  }
	  .con {
				  padding: 20px ;
	  }
	  .t_overtips{
		width: 100%;
		overflow: hidden;        /*内容会被修剪，并且其余内容是不可见的*/
		text-overflow:ellipsis;  /*显示省略符号来代表被修剪的文本。*/
		white-space: nowrap;     /*文本不换行*/
	  }
	  .t_tongji_box{
		background-color: rgb(241, 241, 241);
		padding: 16px 30px;
		box-sizing: border-box;
		/* font-size: 18px; */
		display: flex;
		color: #515151;
		margin-top: 20px;
		margin-bottom: 20px;
	  }
	  .t_title_box{
		display: flex;
		align-items: center;
		color: #525252;
		margin-bottom: 10px;
		margin-top: 20px;
	  }
	  .t_red_g{
		background-color: #2974FF;
		width: 4px;
		height: 16px;
		margin-right: 10px;
	  }
	  .t_red_time{
		color: #2974FF;
	  }
	  .t_search_input{
		width: 191px;
		margin-bottom: 5px;
	  }
	  /* .t_search_box{
		display: flex;
		flex-wrap: wrap;
	  } */
	  /deep/.t_search_box .el-input--suffix .el-input__inner  {
		background-color: #f7f8fa;
		border: none;
	  }
	  /deep/.t_search_box .el-range-editor.el-input__inner{
		background-color: #f7f8fa;
		border: none;
	  }
	  /deep/.t_search_box .el-date-editor .el-range-input{
		background-color: #f7f8fa;
		border: none;
	  }
	  /deep/.t_search_box .el-input__inner{
		background-color: #f7f8fa;
		border: none;
		
	  }
  
	
  </style>
  